<!DOCTYPE html>
<html>
	<head>
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/>
		<meta name="format-detection" content="telephone=no" />
		<link rel="stylesheet" type="text/css" href="../static/css/top_tabBar_style.css"/>
		<link rel="stylesheet" type="text/css" href="../static/css/main.css"/>
		<link rel="stylesheet" href="../static/css/lCalendar.css">
		<meta charset="UTF-8">
		

		<title>支出/收入详情</title>
	</head>
	<body>
<form id="dataForm">

<!--tabBar-->
		<div class="top_tabBar_box">
			<a href="javascript:back()" class="back"><img src="../static/img/back_icon.png" width="22px"></a>
			<div class='tabBar_title'>支出/收入详情</div>
		</div>
		<div class="top_tabBar_box top_tabBar_box_bottom"></div><!--占位框-->
<!--tabBar End-->	
<!--内容-->
		<div class="day_box">
			<div class="day_cont day_box_left fengexian">
				<div class="day_ziduan">起始日期：</div>
				<div class="day_no" style="width:40%;">
				<input sel="dateIpt" style="width:90%;border-style:none;" type="text" readonly name="startDate" id="startDate">
				</div>
				<div class="day_icon" onClick="clickStart();"><img src="../static/img/calendar.png" width="100%"></div>
			</div>
			<div class="day_cont div box_right">
				<div class="day_ziduan">终止日期：</div>
				<div class="day_no" style="width:40%;">
				<input sel="dateIpt" style="width:90%;border-style:none;" type="text" readonly name="endDate" id="endDate">
				</div>
				<div class="day_icon" onClick="clickEnd();"><img src="../static/img/calendar.png" width="100%"></div>
			</div>
		</div>
		<div class="day_box day_box_bottom"></div><!--占位符-->
		<div class="container">
			<ul class="list_ul">
				
			</ul>
		</div>
<!--内容 End-->
</form>
		
		<script src="../static/js/zepto.min.js" type="text/javascript" charset="utf-8"></script>		
		<script src="../static/js/common-util.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="../static/js/laytpl.js"></script>
		<script type="text/javascript" src="../static/js/lCalendar.min.js"></script>
		<script type="text/javascript">
			var calendar1 = new lCalendar();
			var calendar2 = new lCalendar();
	        var rowLength=0;
	        var total = 0; 
			
			$(function(){
				calendar1.init({
			        'trigger': '#startDate',
			        'type': 'date',
			        'dateFmt': ''
			    });
			    calendar2.init({
			        'trigger': '#endDate',
			        'type': 'date',
			        'dateFmt': ''
			    });
			    
	             var endDate = new Date(); 
		         $("#endDate").val(dateToStr(endDate));
         		 var startDate=new Date(endDate.getTime() - 3 * 24 * 3600 * 1000);
			     $("#startDate").val(dateToStr(startDate));
				findDzfpGrid2();
			});
			
			function findDzfpGrid2(){
			var endDate =$("#endDate").val();
			var startDate = $("#startDate").val();
				$.ajax({
					url:basePath+"borer/findBorerDetail",
		            type:"post",
		            data:{endDate:endDate,startDate:startDate},
		            dataType:"json",
		            cache:false,
		            async:false,
		            success:function(data){
		            console.log(data);
		              var html = "";
		               if(null!=data.rows){
			            total =data.total; 
		            	   for(var i=0;i<data.rows.length;i++){
		            		   html += createRow(data.rows[i]);
		            	   }
		               }
		               
		               $(".list_ul").html(html);
		               
		            },
		            error:function(){
		                
		            }
		        });
			}
			function createRow(financial){
				var row = '<li class="list_ul_li"><dl class="list_dl">';
				row += '<dt class="list_dl_dt list_dl_dt_yikai"><i>记录时间：</i><span>'+financial.fdate+'</span></dt>';
				row += '<dt class="list_dl_dt list_dl_dt_yikai"><i>记录人：</i><span>'+financial.name+'</span></dt>';
				if(financial.menoy > 0){
				row += '<dt class="list_dl_dt list_dl_dt_yikai"><i>收入金额：</i><span>'+financial.menoy+'</span></dt>';
				}else{
				row += '<dt class="list_dl_dt list_dl_dt_yikai"><i>支出金额：</i><span>'+financial.menoy+'</span></dt>';
				}
				
				row += '<dt class="list_dl_dt list_dl_dt_yikai"><i>结算金额：</i><span>'+financial.balance+'</span></dt>';
				row += '</dl>';
				row += '<div class="list_btn_box">';
				row += '<div fpid="'+financial.id+'" class="list_btn_box_left">作废记录</div>';
				row += '<div fpid="'+financial.id+'" class="list_btn_box_right">修改记录</div>';
				row += '</div></li>';
				return row;
			}
			
		function nextPage(){
		    var page = $("#page").val();
	        page = new Number(page)+1;
	        $("#page").val(page);
		}
		
		function clickStart(){
		  $("#startDate").click();
		}
		
		function clickEnd(){
		  $("#endDate").click();
		}
		
		function timeChange(){
          findDzfpGrid2();
        }
        
        function back(){
				history.go(-1);
			}
		</script>

	</body>
</html>
